<!DOCTYPE html>
<!--  http://www.w3schools.com/html/html_quick.asp is the good source for learning html -->
<html>
<head>
<title>Login page</title>

<style type="text/css">
.loginPanel {
	text-align: center;
	background-color: orange;
	border-bottom-width: 5px;
	border-style: solid;
}
</style>
<!-- 
<script type="text/javascript" src="/js/jquery/jquery-2.0.3.js"></script>
<script type="text/javascript" src="/js/jquery/jquery.validate.js"></script>
 -->

<script type="text/javascript" src="js/jquery/jquery-2.0.3.min.js"></script>
<script type="text/javascript" src="js/jquery/jquery.validate.min.js"></script>
<script type="text/javascript">

function validate(name){

	alert('hello  ' + name);
	var userName = document.getElementById('userName');
	userName.value ='Bruno';
	alert(userName.value);
	//alert(document.getElementById('userName').Attr('value'));
}


</script>

<script type="text/javascript">


$(document).ready(function () {

	alert('document is loaded');  

	$('#loginForm').validate();

	
})

</script>
</head>
<body>

	<form id='loginForm' method="POST" action="login"
		onsubmit="javascript:validate('hari')">
		<div class="loginPanel">
			<h1>Login page</h1>
			<label for="userName" id="userLabel">User Name</label> <input
				type="text" id="userName" name="userName" class="required" /> <br />
			<label for="password" id="passwordLabel">Password</label> <input
				type="password" id="password" name="password" class="required" /> <br />
			<input type="submit" name="login" value="login" /> <input
				type="reset" />
		</div>

	</form>



</body>

</html>

